<template>
	<div>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-icon mui-icon-left-nav mui-pull-left callback-his" @click="goBack()"></a>
			<h1 class="mui-title">{{title}}解答</h1>
		</header>
		<div class="mui-content">
			<div class="title-box">{{title}}</div>
			<ul class="mui-table-view">
				<template v-for="(item,$index) in list">
					<li class="mui-table-view-cell">
						<router-link :to="{name:'HelpInfo',params:{data:item}}" class="mui-navigate-right">
							{{item.title}}
						</router-link>
					</li>
				</template>
			</ul>
		</div>
	</div>
</template>
<script>
	import {api} from '../../../gloabl/api.js'
	export default{
		data:function(){
			return{
				list:[],
				title:'帮助中心'
			}
		},
		mounted:function(){
			if(this.$route.params.data){
				this.list = this.$route.params.data;
				this.title = this.$route.params.title;
			}else{
				let type = this.$route.query.type;
				this.getFaq(type);
			}
			
		},
		methods:{
			getFaq(type){
				let vm = this;
				let query = '{'+api.helpListApi()+'}';
				vm.$http.post(url.graphql,{query:query})
				.then(function(res){
					let data = res.data.data.allFaqs;
					for (let item of data) {
						if(item.category == type){
							vm.list.push(item)
						}
					}
				}).catch(function (error) {
					mui.alert('请求超时')
				})
			}
		}
	}
</script>
<style scoped="scoped">
	.title-box{
		padding: 15px;
		font-size: 16px;
		font-weight: 600;
		background-color: #FFFFFF;
	}
</style>